<!doctype html>
<html>

<head>
<title>ZhiFeiJi - Demo</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="css/style.css">
<script src="js/gl-matrix.js" type="text/javascript"></script>
<script src="js/model.js" type="text/javascript" charset="UTF-8"></script>
<script src="js/model-obj.js" type="text/javascript" charset="UTF-8"></script>
<script src="js/view.js" type="text/javascript"></script>

<script id="shader-vs" type="x-shader/x-vertex">
    attribute vec3 vertexPos;
    uniform mat4 modelViewMatrix;
    uniform mat4 projectionMatrix;
    void main(void) {
        gl_PointSize = 5.0;
        // Return the transformed and projected vertex value
        gl_Position = projectionMatrix * modelViewMatrix * 
            vec4(vertexPos, 1.0);
    }
</script>

<script id="shader-fs" type="x-shader/x-fragment">
    precision mediump float;
    uniform vec4 uColor;
    void main(void) {
        // Return the pixel color: always output white
        gl_FragColor = vec4(uColor[0], uColor[1], uColor[2], 0.2);
    }
</script>

<script src="js/demo.js" type="text/javascript" charset="utf-8"></script>
</head>

<body>
    <canvas id="model-3d-canvas"></canvas>
    <canvas id="crease-pattern-canvas"></canvas>
    <div id="toolbar">
        <ul id="model-selector">
            <li><a href="#" id="plane-button">Paper Plane</a></li>
            <li><a href="#" id="plane-animated-button">Paper Plane (Animated)</a></li>
            <li><a href="#" id="crane-button">Paper Crane</a></li>
            <li><a href="#" id="crane-animated-button">Paper Crane (Animated)</a></li>
        </ul>
    </div>
</body>

</html>